<template>
	<!-- 赵笛 -->
	<!-- 选择地址页面 -->
	<view style="background:#F5F5F5">
		<u-empty
			mode="list"
			text="收货地址"
			icon="http://cdn.uviewui.com/uview/empty/data.png"
			v-if ="addressList.length===0"
		></u-empty>
		<u-radio-group
			v-model="addressCheck"
			placement="column"
			@change="groupChange"
		>
			<view class="view-box">
			  <u-row justify="space-between"
				gutter="10"
				style="border-bottom:1px solid #EBEBEB;padding:10px ;"
				v-for="(address,index) in addressList">
					<u-col span="1">
						<view class="demo-layout bg-purple">
							<u-icon name="map" color="#E06181" size="24" v-if="address.addressFlag!==0"></u-icon>
							<u-icon name="map" color="#3CCCA6" size="24" v-if="address.addressFlag===0"></u-icon>
						</view>
					</u-col>
					<u-col span="10">
						<view class="demo-layout bg-purple">
							<view>
								<span class="text-title" style="margin-right:6px">{{address.addressConsignee}}</span>
								<span class="text-dark">{{address.addressTelephoneShift}}</span>
							</view>
							<view>
								<span style="width: 100%;overflow:hidden;word-break:break-all;" class="text-light">
								{{address.addressLocationProvince}}
								{{address.addressLocationCity}}
								{{address.addressLocationCounty}}
								{{address.addressDetailed}}
								</span>
							</view>
						</view>
					</u-col>
					<u-col span="1">
						<u-radio
							:key="index"
							:label="address.id"
							:name="address.id"
							@change="radioChange"
						></u-radio>
					</u-col>
				</u-row>
		</view>
		</u-radio-group>
		<view style="margin-bottom:20px;" class="bottom-box">
			<u-button text="选择地址" class="button-box" @click="backPage()" v-if ="addressList.length!==0"></u-button>
			<u-button text="新增地址" class="button-box" @click="toAddAddressPage()" v-if ="addressList.length===0"></u-button>
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userId:0,
				addressList:[],
				addressCheck:1
			}
		},
		onLoad(){
			this.userId = wx.getStorageSync('user').id
			this.getAddressList()
		},
		methods: {
			//跳转至新增地址页面
			toAddAddressPage(){
				uni.navigateTo({
					url:"/pages/my/AddAddressManagement"
				})
			},
			//查询当前用户的收货地址列表
			getAddressList(){
				this.$myRequest({
					url: '/commodity/detail/getAddressList',
					data: {
						userId: this.userId
					}
				}).then(res => {
					if(res.data.flag){
						this.addressList = res.data.data
						for (var i = 0; i < this.addressList.length; i++) {
							if(this.addressList[i].addressFlag===1){
								this.addressCheck = this.addressList[i].id
							}
						}
					}else{
						this.addressList = []
					}
				})
			},
			//返回上一页
			backPage(){
				//获取所有页面栈实例列表
				let pages = getCurrentPages(); 
				//当前页页面实例
				let nowPage = pages[pages.length - 1]; 
				//上一页页面实例
				let prevPage = pages[pages.length - 2]; 
				//修改上一页data里面的地址
				prevPage.$vm.addressId = this.addressCheck; 
				prevPage.$vm.getAddressById();
				uni.navigateBack({
					delta: 1, //返回层数，2则上上页
					success:(event)=>{
					}
				});
			}
		},
	}
</script>

<style lang="less" scoped>
	/**
	 * 公共样式 ↓
	 */
	.text-title {
		//文字标题样式
		font-size: 16px;
		color: #333333;
		font-weight: bold;
	}

	.text-dark {
		//深色文字样式
		font-size: 14px;
		color: #666666;
	}

	.text-light {
		//浅色文字样式
		font-size: 14px;
		color: #999999;
	}

	.text-center {
		//居中文字样式
		text-align: center;
	}

	.view-box {
		line-height: 24px;
		background: #fff;
		padding: 16px 10px;
		margin-bottom: 6px;
	}
	/**
	 * 公共样式 ↑
	 */
	.bottom-box{
		width:100%;
		height:40px;
		position:fixed;
		bottom:0;
		left:0;
		background-color: aqua;
	}
	.button-box {
		color: #ffffff;
		background: #3CCCA6;
		border: none;
		border-radius: 0;
	}
	.button-box:after{
		border: none;
	}
</style>
